/**
 * 
 * <div v-example:params.lazy='someValue'></div>
 * binding={
 *  arg: 'params',
 *  modifiers: { lazy: true },
 *  value: ' `someValue` 的值',
 *  oldValue: '上一次更新时`someValue`的值'
 * }
 */

export default {
  created: (el, binding) => {
    //  created ：绑定元素属性或事件监听器被应用之前调用。该指令需要附加需要在普通的 v-on 事件监听器前调用的事件监听器时，这很有用。
    console.log('created 在绑定元素的父组件挂载之前')
    console.log(el)
    console.log(binding)
  },
  beforeMount: (el, binding) => {
    // beforeMounted ：当指令第一次绑定到元素并且在挂载父组件之前执行。
    // const {instance , vlaue , arg, oldValue  } = binding
    console.log('beforeMount 在绑定元素的父组件挂载之后')
    console.log(el)
    console.log(binding)
  },
  
  beforeUpdate: () => {
    // beforeUpdate ：在更新包含组件的 VNode 之前调用。
    console.log('beforeUpdate 在包含组件的 VNode 及其子组件的 VNode 更新之后调用')
  },
  updated: () => {
    // updated ：在包含组件的 VNode 及其子组件的 VNode 更新后调用。
    console.log('updated 在绑定元素的父组件卸载之前调用')
  },
  beforeUnmount: () => {
    // beforeUnmounted ：在卸载绑定元素的父组件之前调用
    console.log('beforeUnmount 在绑定元素的父组件卸载之后调用')
  },
  unmounted: () => {
    // unmounted ：当指令与元素解除绑定且父组件已卸载时，只调用一次。
    console.log('unmounted 指令与元素解除绑定，切父组件已经卸载，只调用一次')
  },

  //
  mounted(el, binding) {
    // mounted ：绑定元素的父组件被挂载之后调用。
    //   console.log('mounted 在绑定元素的父组件vnode更新之前')
    const permission = binding.value // 获取到指令绑定的值
    const myPermission = ['add', 'update', 'del'] // 当前登录人的权限列表，这里模拟一下，写死了
    if (!myPermission.includes(permission)) {
      // 判断如果当前登录人没有这个元素绑定的权限，就把这个元素移除，所以没有权限的人就看不到这个内容了
      el.parentNode && el.parentNode.removeChild(el)
    }
  }
}